<template>
        <div>
          <zh-card title="接口信息">
            <zh-form ref="formRef" style="width: 96%" :md="12" :lg="12" :xl="12" :model="apiInfo" :rules="rules"
                     label-width="200px">
                <zh-form-input prop="funcTitle" label="功能标题" placeholder="添加标题"
                               v-model="apiInfo.funcTitle"></zh-form-input>
                <zh-form-select
                        prop="funcType"
                        label="功能类型"
                        :options="state.dictData.funcType"
                        placeholder="请选择（默认为查询）"
                        v-model="apiInfo.funcType"
                ></zh-form-select>
                <zh-form-input prop="serviceName" label="服务名" placeholder="注册到注册中心的服务名"
                               v-model="apiInfo.serviceName"></zh-form-input>
                <zh-form-input prop="qps" label="每秒调用量" placeholder="调用频次每秒并发调用量"
                               v-model="apiInfo.qps"></zh-form-input>
                <zh-form-input prop="api" label="url路径" placeholder="http的url路径，webservice·的方法名"
                               v-model="apiInfo.api"></zh-form-input>
                <zh-form-select
                        prop="apiType"
                        label="接口类型"
                        :options="state.dictData.apiType"
                        placeholder="请选择接口类型"
                        v-model="apiInfo.apiType"
                ></zh-form-select>
                <zh-form-select
                        prop="httpMethod"
                        label="调用方式"
                        :options="[{dictKey:'get',dictValue:'get'},{dictKey:'post',dictValue:'post'}]"
                        placeholder="请选择调用方式"
                        v-model="apiInfo.httpMethod"
                ></zh-form-select>
              <zh-form-select
                  prop="funcSourceType"
                  label="功能来源"
                  :options="state.funcSourceTypeOpt"
                  placeholder="请选择"
                  v-model="apiInfo.funcSourceType"
              ></zh-form-select>

                <zh-form-input prop="timeout" label="服务超时时间" placeholder="服务超时时间(秒)"
                               v-model="apiInfo.timeout"></zh-form-input>
                <zh-form-input prop="visits" label="每日次数" placeholder="每日访问上限次数"
                               v-model="apiInfo.visits"></zh-form-input>
                <zh-form-select
                        prop="customCharset"
                        label="自定义字符集"
                        :options="state.dictData.charset"
                        placeholder="请选择自定义字符集,默认为utf-8"
                        v-model="apiInfo.customCharset"
                ></zh-form-select>
                <zh-form-select
                        prop="contentType"
                        label="请求类型"
                        :options="state.dictData.httpContentType"
                        placeholder="请选择请求类型"
                        v-model="apiInfo.contentType"
                ></zh-form-select>
                <zh-form-select
                        prop="networkType"
                        label="对外访问网络类型"
                        :options="state.dictData.networkType"
                        placeholder="对外访问网络类型"
                        v-model="apiInfo.networkType"
                ></zh-form-select>
                <zh-form-radio
                        :sm="12"
                        :lg="8"
                        :xl="8"
                        label="是否需要转义"
                        prop="isEncode"
                        v-model="apiInfo.isEncode"
                        :options="state.dictData.flag"
                ></zh-form-radio>
                <zh-form-select
                        prop="otherAccessFlag"
                        label="是否对第三方应用开放"
                        :options="state.dictData.flag"
                        placeholder="是否对第三方应用开放"
                        v-model="apiInfo.otherAccessFlag"
                ></zh-form-select>
                <zh-form-radio
                        :sm="12"
                        :lg="8"
                        :xl="8"
                        label="是否公共"
                        prop="publicFlag"
                        v-model="apiInfo.publicFlag"
                        :options="state.dictData.flag"
                ></zh-form-radio>
                <zh-form-radio
                        :sm="12"
                        :lg="8"
                        :xl="8"
                        label="申请是否需审核"
                        prop="authFlag"
                        v-model="apiInfo.authFlag"
                        :options="state.dictData.flag"
                ></zh-form-radio>
                <zh-form-input
                        prop="funcDesc"
                        :span="24"
                        label="功能描述"
                        type="textarea"
                        placeholder="功能描述"
                        v-model="apiInfo.funcDesc"
                ></zh-form-input>
            </zh-form>
          </zh-card>
        </div>
</template>
<script lang="ts" setup name="apiRegister">
import {FormInstance} from 'element-plus';
//------------------接收传入参数(组件)-------------------

//------------------定义子组件---------------------------
const formRef = ref<FormInstance>();

//------------------内部变量定义-------------------------
const state = reactive({
    dictData: {} as any,
    appDict: [],
    orgDict: [],
    devOrgDict: [],
    funcSourceTypeOpt: [
      {dictKey: '1', dictValue: '内部服务'},
      {dictKey: '2', dictValue: '第三方应用接入'},
      {dictKey: '3', dictValue: '编排接口'}
    ],
});
const rules = reactive({
    funcTitle: [
        {
            required: true,
            message: '请输入功能名称',
            trigger: 'blur',
        },
    ],
    serviceName: [
        {
            required: true,
            message: '请输入服务名',
            trigger: 'blur',
        },
    ],
    httpMethod:[
      {
        required: true,
        message: '请选择调用方式',
        trigger: 'blur',
      },
    ],
    nodeType: [
        {
            required: true,
            message: '请输入节点类型',
            trigger: 'blur',
        },
    ],
    timeout: [
        {
            required: true,
            message: '请输入是否超时时间',
            trigger: 'blur',
        }
    ],
    api: [
        {
            required: true,
            message: '请输入接口路径',
            trigger: 'blur',
        }
    ],
    apiType:[
        {
            required: true,
            message: '请选择接口类型',
            trigger: 'blur',
        }
    ],
    visits: [
        {
            required: true,
            message: '请输入每日访问上限次数',
            trigger: 'blur',
        }
    ],
    funcSourceType: [
      {
        required: true,
        message: '请输入功能来源类型',
        trigger: 'blur',
      },
    ],
});
const apiInfo = ref<any>({
  funcSourceType:'2'
});
//------------------定义调用方法-------------------------
//重置表单
function resetForm(){
    formRef.value?.resetFields();
}

//------------------初始化------------------------------
const params = {
    dictFields: 'funcType,apiType,flag,funcSourceType,charset,httpContentType,networkType',
};
$api.common.getBatchDict.post(params).then((res) => {
    state.dictData = res.result;
});
$api.common.send.post('application0011', {}).then((res) => {
    state.appDict = res.result;
});
$api.common.send.post('org0019', {orgType: '01'}).then((res) => {
    state.orgDict = res.result;
});
$api.common.send.post('org0019', {orgType: '0201'}).then((res) => {
    state.devOrgDict = res.result;
});
$api.common.send.post('function0010', {}).then((res) => {
    apiInfo.value.funcCode = res.result;
});

//------------设置给父组件调用的数据/方法(组件)-----------
defineExpose({resetForm,form: formRef,apiInfo});
</script>
<style lang="scss" scoped></style>
